Using styles

Styles are used for setting the property values of one or more objects of a certain type. In a style you set the values of properties the style then applies to an object. To override a property defined in a style, add that property to the object to which the style applies.

You can:

Applying a style to all instances of an object type

Global styles define the look and feel for a certain type of object in the entire Kanzi Studio project.

For example, when you create a global style for Text Block objects and set the Font Color property value to black, the font color of all Text Block objects in your Kanzi Studio project is black.

To apply a style to all instances of an object type:

  1. In the Library right-click Styles and select Create > Global Style.
  2. In the Properties set the Target Type property to the object type for which you want to define a style.
    For example, set Target Type to Text Block to define a style for all Text Block objects in your project.
  3. In the Properties click Add Properties, and add and set the properties you want to define with the style.
    For example, to define the color of font for a Text Block object, add Font Color property and set it to red.
  4. If the properties you defined in the style exist in the target objects, remove them from the target objects so that the style can take effect.

Applying a style to descendants of an object type

Target styles define the look and feel for a specific branch of objects in a Kanzi Studio project.

For example, to use different font sizes for the text at different levels of navigation, create a style for each navigation level, and add each style to the resource dictionary at each level of navigation.

To apply a style to descendants of an object type:

  1. In the Library right-click Styles and select Create > Target Style.
  2. In the Properties set the Target Type property to the object type for which you want to define a style.
    For example, set Target Type to Text Block to define a style for Text Block objects in your project.
  3. In the Properties click Add Properties, and add and set the properties you want to define with the style.
    For example, to define the color of font for a Text Block object, add Font Color property and set it to red.
  4. In the Properties of the object for which you defined the style add the Resource Dictionary property, and in the Context Resources add the style to the scope of the object to whose descendants you want to apply the style.
  5. If the properties you defined in the style exist in the target objects, remove them from the target objects so that the style can take effect.

Applying a style to selected instances of an object type

Named styles define the look and feel only for the selected instances of an object type, or override the global and target styles. For example, if you create a global style for the Text Block, you can override that style with a named style.

To apply a style to only selected instances of an object type:

  1. In the Library right-click Styles and select Create > Named Style.
  2. In the Properties set the Target Type property to the object type for which you want to define a style.
    For example, set Target Type to Text Block to define a style for Text Block objects in your project.
  3. In the Properties click Add Properties, and add and set the properties you want to define with the style.
    For example, to define the color of font for a Text Block object, add Font Color property and set it to red.

  4. In the Project select the object to the instance of which you want to apply the style, in the Properties click Add Properties, add the Style property, and set it to a named style.

  5. If the properties you defined in the style exist in the target objects, remove them from the target objects so that the style can take effect.

See also

Using local and global resources

Styles

Open topic with navigation